// vue指令

// 图片懒加载
export const lazy = (app) => {
  app.directive('lazy', {
    mounted(el, binding) {
      const observe = new IntersectionObserver(
        ([{ isIntersecting }]) => {
          if (isIntersecting) {
            el.src = binding.value;
            el.onerror = () => {
              el.src =
                '@/assets/images/90d64450-c526-40bc-9998-696d326f5da1.png';
            };
            // 进入可视区之后停止观察
            observe.unobserve(el);
            // 把指令的值设置给el的src属性
          }
        },
        {
          threshold: 0,
        }
      );
      observe.observe(el);
    },
  });
};
